<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <jsp:include page="inc/js.jsp"/>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>添加新记录</title>
    <jsp:include page="inc/css.jsp"/>
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-12">
                    <div class="card" style="margin-top: 10px">
                        <!-- /.card-header -->
                        <div class="card-header">
                            <a href="javascript:void(0)" style="margin-left: 5px;" onclick="_submitInfo.fn.subInfo()" class="btn btn-success" role="button">保存</a>
                        </div>
                        <div class="card-body">
                            <div class="form-inline">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">类别:</label>

                                    <div class="col-sm-8">
                                        <select id="typeList" style="width: 200px;" class="form-control">
                                            <option value="">请选择类别</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-2 control-label">其他类别:</label>

                                    <div class="col-sm-8">
                                        <input type="text" class="form-control" id="content" maxlength="20" placeholder="请输入其他类别"/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-2 control-label">金额:</label>

                                    <div class="col-sm-8">
                                        <input type="number" class="form-control" id="money" maxlength="20" placeholder="请输入金额"/>
                                    </div>
                                </div>

                                <div class="form-group">
                                    <label class="col-sm-2 control-label">类型:</label>

                                    <div class="col-sm-8">
                                        <select id="statusList" style="width: 200px;" class="form-control">
                                            <option value="0">支出</option>
                                            <option value="1">收入</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <!-- /.card-body -->
                        </div>
                        <!-- /.card -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
        </section>
        <!-- /.content -->
    </div>
</div>
<!-- ./wrapper -->

<!-- page script -->
<script type="text/javascript">
    var _submitInfo = {
        v: {
            list: []
        },
        fn: {
            init: function () {
                _submitInfo.fn.getTypeList();
            },
            subInfo: function () {
                var flag = true;
                var typeId = $('#typeList option:selected').val();
                var content = $('#content').val().trim();
                var money = $('#money').val();

                if (typeId == '' && content == '') {
                    info("error", "请选择对应的类别或者输入新的内容");
                    flag = false;
                    return;
                }

                if (null == money || money == '') {
                    info("error", "请输入金额");
                    flag = false;
                    return;
                }

                // 所有的验证通过后，执行新增操作
                if (flag) {
                    $.post('backend/moneyRecord/iSaveInfo', {
                        typeId: typeId,
                        content: content,
                        money: money,
                        status: $('#statusList option:selected').val()
                    }, function (result) {
                        if (result === 1) {
                            info("success", "保存成功");

                            _submitInfo.fn.refreshData();
                        } else {
                            info("error", "操作失败");
                        }
                    });
                }
            },
            refreshData: function () {
                _submitInfo.fn.getTypeList();
                $('#content').val('');
                $('#money').val('');
                $('#statusList').val('0');
            },
            getTypeList: function () {
                $safe.ajax("common/typeList", {
                    ids: 0
                }, function (result) {
                    if (null != result) {
                        var content = "<option value=''>请选择类别</option>";
                        jQuery.each(result, function (i, item) {
                            content += "<option value='" + item.id + "'>" + item.name + "</option>";
                        });
                        $('#typeList').html(content);
                    } else {
                        info("error", "服务器故障，请联系管理员");
                    }
                });
            }
        }
    };

    $(document).ready(function () {
        _submitInfo.fn.init();
    });
</script>
</body>
</html>